<script>
// 引入vue3 getCurrentInstance
import { getCurrentInstance } from 'vue';
export default {
  globalData: {
    navHeight: 0, //总体高度
    statusBarHeight: 0, // 状态导航栏高度
    navigationBarHeight: 0, // 导航栏高度(标题栏高度)
    customWidth: 0 //胶囊宽度,
  },
  onLaunch: function () {
    uni.getSystemInfo({
      success: function (e) {
        // 获取 appContext  上下文
        const { appContext } = getCurrentInstance();
        console.log('StatusBar', appContext);
        // #ifndef MP
        appContext.config.globalProperties.StatusBar = e.statusBarHeight;
        if (e.platform == 'android') {
          appContext.config.globalProperties.CustomBar = e.statusBarHeight + 50;
        } else {
          appContext.config.globalProperties.CustomBar = e.statusBarHeight + 45;
        }
        // #endif
        // #ifdef MP-WEIXIN
        appContext.config.globalProperties.StatusBar = e.statusBarHeight;
        let custom = wx.getMenuButtonBoundingClientRect();
        appContext.config.globalProperties.Custom = custom;
        appContext.config.globalProperties.CustomBar = custom.bottom + custom.top - e.statusBarHeight;
        // #endif
        // #ifdef MP-ALIPAY
        appContext.config.globalProperties.StatusBar = e.statusBarHeight;
        appContext.config.globalProperties.CustomBar = e.statusBarHeight + e.titleBarHeight;
        // #endif
      }
    });

    console.log('App Launch');
    this.getWxNavbar();
  },
  onShow: function () {
    console.log('App Show');
  },
  onHide: function () {
    console.log('App Hide');
  },
  methods: {
    getWxNavbar() {
      this.globalData.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
      // #ifdef H5
      this.globalData.navigationBarHeight = 44;
      this.globalData.navHeight = this.globalData.navigationBarHeight + this.globalData.statusBarHeight + uni.upx2px(20);
      // #endif
      // #ifdef MP-WEIXIN
      // 获取微信胶囊的位置信息 width,height,top,right,left,bottom
      const custom = wx.getMenuButtonBoundingClientRect();
      this.globalData.customWidth = custom.width - 7;
      // console.log(custom)
      // 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
      this.globalData.navigationBarHeight = custom.height + (custom.top - this.globalData.statusBarHeight) * 2;
      // console.log("导航栏高度："+this.globalData.navigationBarHeight)
      // 总体高度 = 状态栏高度 + 导航栏高度
      this.globalData.navHeight = this.globalData.navigationBarHeight + this.globalData.statusBarHeight + uni.upx2px(20);
      // #endif
    }
  }
};
</script>

<style lang="scss">
@import 'colorui/main.css';
@import 'colorui/icon.css';
/* 注意要写在第一行，同时给style标签加入lang="scss"属性----uview-plus */
@import 'uview-plus/index.scss';
/*每个页面公共css */
@import '@/uni_modules/uni-scss/index.scss';
@import './common/css/common.css';
</style>
